<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!doctype html>
<html>
<head>
	<meta http-equiv="Content-Type" content="UTF-8">
	<title>红酒会 - 智能红酒管家</title>
	<meta http-equiv="Pragma" content="no-cache" /> 
	<meta http-equiv="Cache-Control" content="no-cache" /> 
	<meta http-equiv="Expires" content="0" /> 
	<link type="text/css" rel="stylesheet" href="${ctx}/static/styles/style.css">
	<script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript" src="${ctx}/static/scripts/winwine.js"></script>
	<style type="text/css">
		html,body,.scene { width: 100%; height: 100%; overflow: hidden;}
	</style>
</head>

<body>
	<ul id="scene" class="scene">
		<li class="layer registrationBg" data-depth="0.20">
			<div class="regBg"></div>
		</li>
		<li class="layer" data-depth="0">
			<div class="loginBox">
			
<form action="${ctx}/login" method="post">
	<input type="hidden" name="redirectUrl" value="${redirectUrl}"/>
	<div class="loginL">
		<div class="red" style="text-align:center">${errorMsg}</div>
		<ul class="loginUl">
			<li><input type="text" id="username" name="username" class="textLog textL01"
				autocomplete="off" placeholder="请输入用户名" /></li>
			<li><input type="password" id="password" name="password" class="textLog textL02"
				autocomplete="off" placeholder="请输入密码" /></li>
			<li><input type="text" id="verify" name="verify" class="textLog textL03" placeholder="请输入验证码" />
				<a href="javascript:;" onclick="refreshVerifyCode()">
					<img id="verifyCode" class="regyzm" style="height:28px; width:80px;"/></a>
				<span class="spanyzm">看不清
				<a href="javascript:;" onclick="refreshVerifyCode()">换一张</a></span></li>
		</ul>
		<div class="zddlBox">
			<label for="remember">
				<input type="checkbox" id="remember" name="remember" class="checkAgr">
				<span>两周内自动登录</span>
			</label>
			<a href="${ctx}/forgot" class="Awjmm">忘记密码？</a>
		</div>
		<div class="qtdl">
			<a href="javascript:;" id="btnLogin"><img src="${ctx}/static/images/ljdl.png"></a>
		</div>
	</div>
</form>

			<div class="loginR">
				<img src="${ctx}/static/images/loginR.png" alt="">
				<p>您还没有红酒会账户?<a href="${ctx}/register">立即注册</a></p>
				<div style="padding-top:20px;">
					<a href="javascript:;">
						<img alt="QQ" src="${ctx}/static/images/login_qq.png" width="49" height="21"></a>
					<a href="javascript:;">
						<img alt="新浪微博" src="${ctx}/static/images/login_sina.png" width="76" height="21"></a>
				</div>
			</div>
		</div>
	</li>
	</ul>

	<script type="text/javascript">
		$(function() {
			refreshVerifyCode();
			
			$('#btnLogin').click(function() {
				$('input[class^="textLog"]').removeClass('login_yz');
				if($('#username').val() == '') {
					$('#username').addClass("login_yz").focus();
				}else if($('#password').val() == '') {
					$('#password').addClass("login_yz").focus();
				}else if($('#verify').val() == '') {
					$('#verify').addClass("login_yz").focus();
				}else {
					$.ajax({
						url:'${ctx}/validate/verify',
						data: {verify: $('#verify').val()},
						success: function(result) {
							if(result) {
								document.forms[0].submit();
							}else {
								refreshVerifyCode();
								$('#verify').addClass("login_yz").focus();
							}
						}
					});
				}
			});
			
			document.onkeydown = function(e){ 
			    var ev = document.all ? window.event : e;
			    if(ev.keyCode==13) {
					$('#btnLogin').click();	
			    }
			};
		}); 
	</script>
</body>
</html>